<template>
  <div class="q-pa-md q-gutter-sm">
    <t-button flat color="primary" label="Flat" />
    <t-button flat rounded color="primary" label="Flat Rounded" />
    <t-button flat round color="primary" icon="card_giftcard" />
    <br />
    <t-button outline color="primary" label="Outline" />
    <t-button outline rounded color="primary" label="Outline Rounded" />
    <t-button outline round color="primary" icon="card_giftcard" />
    <br />
    <t-button push color="primary" label="Push" />
    <t-button push color="primary" round icon="card_giftcard" />
    <t-button push color="white" text-color="primary" label="Push" />
    <t-button push color="white" text-color="primary" round icon="card_giftcard" />
    <br />
    <t-button unelevated color="primary" label="Unelevated" />
    <t-button unelevated rounded color="primary" label="Unelevated Rounded" />
    <t-button unelevated round color="primary" icon="card_giftcard" />
    <br />
    <t-button no-caps color="primary" label="No caps" />
    <br />
    <t-button class="glossy" color="teal" label="Glossy" />
    <t-button class="glossy" rounded color="deep-orange" label="Glossy Rounded" />
    <t-button class="glossy" round color="primary" icon="card_giftcard" />
    <t-button class="glossy" round color="secondary" icon="local_florist" />
    <t-button class="glossy" round color="deep-orange" icon="local_activity" />
  </div>
</template>
